<extend name="Base/common"/>
<block name="body">

<div class="index-nav">
	<img id="show" class="index-navclick" src="__IMG__/icon12.png" />
	<div class="index-navportrait"><img src="{$headimgurl}" /></div>
	<div class="index-money">
		余额<span id="balance">{$money}</span>元
	</div>
</div>
<div class="index-nav" style="border-bottom: none;">
	<a href="{:U('User/discount')}" class="indexkao" style="border-right:1px solid #a4a3a3 ;"><img src="__IMG__/icon19.png"/><span style="color: #ffaf03;" id='diyongquan'>{$count}</span>&nbsp;张</a>
	<a href="{:U('Pay/personal_incharge')}" class="indexkao"><img src="__IMG__/icon20.png"/><span style="color: #000;">充值</span></a>
</div>


<div class="index-conter1">期权合约</div>
<div class="sover">
<ul class="selidr swiper-container">
	<div class="ssea swiper-wrapper">
	<volist name='futures' id="vo" key='k'>
	<li i='{$k}' class="swiper-slide">
		<div class="selidrtop1" <if condition="$vo['authority_status'] eq 1"> data-heyueshou='10' <else />data-heyueshou='1'</if> data-heyueid = "{$vo.id}" data-heyuename="{$vo.name}" data-heyuestart="{$vo.begin_time}" data-heyueover="{$vo.end_time}">{$vo.name}</div>
		<div class="threeli">
			<div class="threelileft">实时价格&nbsp;<span>{$vo.sell_price}</span></div>
			<div class="threeliright data-heyue" data-star='{$vo.price}' data-heyuemony='{$vo.price}' data-downs='1'>买涨</div>
		</div>
		<div class="threeli">
			<div class="threelileft">实时价格&nbsp;<span>{$vo.last_price}</span></div>
			<div class="threeliright data-heyue" data-star='{$vo.price}' data-heyuemony='{$vo.price}' data-downs='2'>买平</div>
		</div>
		<div class="threeli">
			<div class="threelileft">实时价格&nbsp;<span>{$vo.buy_price}</span></div>
			<div class="threeliright data-heyue" data-star='{$vo.price}' data-heyuemony='{$vo.price}' data-downs='0'>买跌</div>
		</div>
		<div class="selidrjia" <if condition="$vo['authority_status'] eq 1"> data-heyueshou='10' <else />data-heyueshou='1'</if>><span></span> 权利金:<span>{$vo.premium}</span>元/张</div>
	</li>
	</volist>
	</div>
	<div class="clicks swiper-pagination">
	</div>
	<div class="selidrleft swiper-button-prev"></div>
	<div class="selidrright swiper-button-next"></div>
</ul>
</div>

<!--*******************新    结束*********************-->

<div class="index-conter1">行情走势</div>
<!-- <div class="index-zhexian"><img src="__IMG__/linshi.png" /></div> -->
<div class="echarts_con">
	<!-- 商品期货 -->
    <volist name="futures" id="vo" key="k">
	<div class="echarts_mcon" <if condition="$k gt 1"> style="display:none" </if>>
		<!-- 分时线 -->
		<div class="echartsBox_a">
            <if condition="$vo['type_sign'] eq 'commodity' ">
			<div class="echartsBox" >
		    <!-- <img src="http://img1.money.126.net/chart/fu/time/520x300/{$vo.code|strtolower}.png?{:time()}"> -->
	   		<img src="http://hqgnqhpic.eastmoney.com/EM_Futures2010PictureProducter/Index.aspx?ImageType=R&ID={$vo.code|strtolower}1&v={:time()}">
	   		</div>
	   		
			<!-- 1月日K -->
			<div class="echartsBox echartsBox2"  >
			    <img src="http://img1.money.126.net/chart/fu/kline/day/30/{$vo.code|strtolower}.png">
	   		</div>

	   		<!-- 3月日K -->
			<div class="echartsBox echartsBox2" >
			    <img src="http://img1.money.126.net/chart/fu/kline/day/90/{$vo.code|strtolower}.png">
	   		</div>

			<!-- 6月日K -->
			<div class="echartsBox echartsBox2" >
			    <img src="http://img1.money.126.net/chart/fu/kline/day/180/{$vo.code|strtolower}.png">
	   		</div>
            
			<!-- 周k线 -->
			<div class="echartsBox echartsBox2" >
			    <img src="http://img1.money.126.net/chart/fu/kline/week/{$vo.code|strtolower}.png">
	   		</div>
			
			<!-- 月k线 -->
			<div class="echartsBox echartsBox2" >
			    <img src="http://img1.money.126.net/chart/fu/kline/month/{$vo.code|strtolower}.png">
	   		</div>

            <else/>

            <div class="echartsBox" >
            <img src="http://img1.money.126.net/chart/fu/time/520x300/{$vo.code|strtoupper}.png?0.4242627832572907">
            </div>
            
            <!-- 1月日K -->
            <div class="echartsBox echartsBox2"  >
                <img src="http://img1.money.126.net/chart/fu/kline/day/30/{$vo.code|strtoupper}.png">
            </div>

            <!-- 3月日K -->
            <div class="echartsBox echartsBox2" >
                <img src="http://img1.money.126.net/chart/fu/kline/day/90/{$vo.code|strtoupper}.png">
            </div>

            <!-- 6月日K -->
            <div class="echartsBox echartsBox2" >
                <img src="http://img1.money.126.net/chart/fu/kline/day/180/{$vo.code|strtoupper}.png">
            </div>

            <!-- 周k线 -->
            <div class="echartsBox echartsBox2" >
                <img src="http://img1.money.126.net/chart/fu/kline/week/{$vo.code|strtoupper}.png">
            </div>
            
            <!-- 月k线 -->
            <div class="echartsBox echartsBox2" >
                <img src="http://img1.money.126.net/chart/fu/kline/month/{$vo.code|strtoupper}.png">
            </div>
            </if>
		</div>

		<ul class="echarts_ul clearfix">
			<li class="red_bor_btm">分时线</li>
			<li class="five">1月日k</li>
			<li class="three">3月日k</li>
			<li class="six">6月日k</li>
			<li class="day">周k线</li>
			<li class="day">月k线</li>
		</ul>
		
	</div>
	</volist>
	

	

</div>
<div class="index-conter1" style="background: #FFF;">最新资讯</div>
<ul class="index-xinxi">
	<volist name='new' id="vo">
	<li><a href="{:U('Article/article?id='.$vo['id'])}">{$vo.title}</a></li>
	</volist>
</ul>
<!--弹出-->
<div class="dailog_mask"></div>
<div class="index-mask clearfix">
	<div class="index-masktop">确认开仓</div>
	<div class="index-maskbox">
		<div class="index-maskhand" data-mon='1'>
				<input id="shuru" type="text" pattern="[0-9]*"  placeholder="请输入数量" />
		</div>
		<div class="index-maskdiyong">
			<volist name="vouchers" id="v" key="k">
			<div class="diyu">
				<input type="checkbox"  class="index-click index-clicks"/>
				<span class="index-maskmo">使用</span>
				<img src="__IMG__/icon16.png" class="index-maskdiicon"/>
				<span class="index-maskmo data-miane">{$v.money}</span>
				<span class="index-maskmo">元</span>
				<span class="index-maskjia" data-id="{$v.voucher_id}" data-miane="{$v.money}" data-number="{$v.count}" data-array="{$k}">
					<span class="jias">-</span>
					<span class="index-zhong">0</span>
					<span class="jias">+</span>
				</span>
			</div>
			</volist>
			<p>
				<span id="index-djian" class="money_total" data-mony=''>元</span><!--<span id="index-hand">1</span>手续费<span id='index-yongj'>20</span>-->
			</p>
		</div>
		<p class="index-maskps">买入价:<span class="red data-lastprice">0</span></p>
		<input type="hidden" name="money" id="money" value="{$money}">
		<p class="index-maskps data-heyueshijian">交割时间:<span></span></p>
		<p class="index-maskps data-downs">方向:<span class="red"></span></p>
		<p class="index-maskps data-heyuename"></p>		
		<p class="index-maskps msg" id="msg" style="color:red;display:none;"></p>
		<a href="javascript:sub_form()" class="index-maskqueren">立即支付</a>
		</if>
	</div>
	
	
	
	
</div>
<!--弹出开始-->
<notempty name="arr">
<div class="bottom-position">
	<div class="bottom-button">
		<img src="__IMG__/public-index02.png" >
		<img style="display: none;" src="__IMG__/public-index.png" >
	</div>
	<ul class="bottom-ul">
	<div>
	<foreach name="arr" item="vo">
			<li data-l="{$vo.id}">
			<p class="bottom-p01">
				<span class="bottom-span01">{$vo.name}</span>
				<span class="bottom-span02">
					<if condition="$vo['status'] eq '0' ">等待中</if>
					<if condition="$vo['status'] eq '1' ">操盘中</if>
				</span>
			</p>
			<p class="bottom-p02">
				<span class="bottom-span03 span">({$vo.number}张)
				<if condition="$vo['direction'] eq '0' "><span class="a3">跌</span></if>
				<if condition="$vo['direction'] eq '1' "><span class="a1">涨</span></if>
				<if condition="$vo['direction'] eq '2' "><span class="a2">平</span></if>
				</span>
				<span class="bottom-span04 span">买价{$vo.open_price}</span>
				<span class="bottom-span05 span">收益<span class="a1">{$vo.gain}</span></span>
				<span class="bottom-span06 span">交割时间:<span>{:date("d号H:i",$vo['end_time'])}</span></span>
			</p>
		</li>
	</foreach>
	</div>
	</ul>
	
</div>
</notempty>
<script type="text/javascript">
//底部进行中显示
$('.bottom-button').click(function(){
	$('.bottom-ul').toggle();
	$('.bottom-button').find('img').eq(0).toggle();
	$('.bottom-button').find('img').eq(1).toggle();
	var heig=$(window).height(),heix=$('.bottom-ul').height();
	if(heix>heig*0.8){
		$('.bottom-ul').height(heig-40);
	};
})
//交易进行中ajax刷新
setInterval(function(){
	var leng=$('.bottom-ul').find('div').find('li').length;
	var url="{:U('Update/update_index_orders')}";
	var ids=new Array();
	for(var i=0;i<leng;i++){
		var ys=$('.bottom-ul').find('div').find('li').eq(i).attr('data-l');
		ids.push(ys);
	};
	$.ajax({
		type:"post",
		url:url,
		data:{'ids':ids},
		dataType:"json",
		async:false,
		success:function(data){
			 for(var i=0;i<leng;i++){
			 	$('.bottom-ul').find('div').find('li').eq(i).find('.bottom-p02').find('.bottom-span05').find('.a1').html(data[i]["lastprofit"]);
			 }
		}
	}),JSON;
},2000);

//首页的滑动
var sindex=0;
window.onload = function() {
   var mySwiper = new Swiper ('.swiper-container', {
    direction: 'horizontal',
    loop: false,
    
    // 如果需要分页器
    pagination: '.swiper-pagination',
    
    // 如果需要前进后退按钮
    nextButton: '.swiper-button-next',
    prevButton: '.swiper-button-prev',
    slidesPerView: 1,
    paginationClickable: true,
    spaceBetween: 10,
    onSlideChangeEnd:function(swiper){
    	sindex=swiper.activeIndex;
        $('.echarts_con .echarts_mcon:eq(' + swiper.activeIndex + ')').show().siblings().hide();
    }
  })             
}
//5秒请求一次分时线
var i=0;
setInterval(function(){
	i++;
	var netime=$('.echarts_con').find('.echarts_mcon').eq(0).find('.echartsBox_a').find('.echartsBox').eq(0).find('img').attr('src');
	var neImg=new Image();
	neImg.src=netime+i;
	$('.echarts_con').find('.echarts_mcon').eq(sindex).find('.echartsBox_a').find('.echartsBox').eq(0).find('img').remove();
	$('.echarts_con').find('.echarts_mcon').eq(sindex).find('.echartsBox_a').find('.echartsBox').eq(0).append(neImg);
},120000)



// 图表切换
$(document).ready(function(){
	$('.echartsBox2').hide();
})

$(".echarts_ul li").click(function(){	
	var index = $(this).index();
	console.log(index);
    $(this).addClass('red_bor_btm').siblings('li').removeClass('red_bor_btm');
    $(this).parent().parent().find('.echartsBox_a').find('.echartsBox').eq(index).show().siblings().hide()
})


//单选框选中
$('.index-clicks').each(function(){
	$(this).click(function(){
		var clas=$(this).attr('checked');
		if(clas=='checked'){
			$(this).removeClass('index-clickde').addClass('index-click').removeAttr('checked');
		}else{
			$(this).removeClass('index-click').addClass('index-clickde').attr('checked','checked');
		};
		$(this).parent().parent().find('.index-maskjia').find('.index-zhong').html('0');
		var sd=$(this).parent().parent().find('.index-maskjia').attr('data-array');
		youhui[sd]=null;
		fsmongy();
	})
})
//点击加减
$('.jias').each(function(){
	$(this).click(function(){
		var youhuisss=$(this).parent().attr('data-number');//优惠券有多少张
		var val=$(this).html();//加还是减
		var miane=parseInt($(this).parent().attr('data-miane'));//优惠券面额
		var ck=$(this).parent().parent().find('input').attr('checked');//当前优惠券是否选中
		var arr=$(this).parent().attr('data-array');
		if(ck=='checked'){
			if(val=='-'){
				var vals=parseInt($(this).parent().find('.index-zhong').html());//当前使用的优惠券的数量
				if(vals=='0'){
					return ;
				}else{
					$(this).parent().find('.index-zhong').html(vals-1);
					var arr=$(this).parent().attr('data-array');
					youhui[arr]=miane*(vals-1);
				};
			}else if(val=='+'){
				var vals=parseInt($(this).parent().find('.index-zhong').html());//当前使用的优惠券的数量
				if(vals==youhuisss || vals>=1){
					return ;
				}else{
					$(this).parent().find('.index-zhong').html(vals+1);
					var arr=$(this).parent().attr('data-array');
					youhui[arr]=miane*(vals+1);
				};
			};
		}
		
		fsmongy();
	})
})
$('#shuru').keyup(function(){
	var newval=$(this).val();
	var type=/^[1-9]\d*$/;
	var re = new RegExp(type);
	if (newval.match(re) == null) {
        $('#msg').html("请输入大于零的整数!").show();
        heyuexuanzhe=0;
        $('#index-djian').html('0元');
        $('#shuru').val('');
        return;
    }else{
	    heyuexuanzhe = $(this).val();
	    $('#msg').html("").hide();
		fsmongy();
    }
})
//金额的处理

function fsmongy(){
//	var daj=$(this).parent().parent().find('.index-maskdiyong').find('#index-djian').attr('data-mony');
//	$(this).parent().parent().find('.index-maskdiyong').find('#index-djian').html((heyuexuanzhe*parseFloat(daj)).toFixed(2)+'元');
//计算优惠券使用的金额
var mo=0;
for(var d=0;d<youhui.length;d++){
	if(youhui[d]==undefined){
		
	}else{
		mo=mo+youhui[d];
	}
};
//var mony=//金额的计算
var dirmony=heyuexuanzhe*heyuemony-mo;
//console.log(heyuexuanzhe+'/'+heyuemony+'/'+dirmony);
if(dirmony<0){
	dirmony=0;
	$('.msg').show().html('您使用的优惠券面额已超出支付所需面额');
}else{
	$('.msg').hide();
}
$('#index-djian').html(dirmony+'元');
//判断当前支付金额是否答应余额
	var money_total=$('.money_total').html();
	var money=$('#money').val();
	if(Number(money)<Number(money_total)){
//		$('.msg').html('');
//		$('.msg').css('display','none');
		$('.index-maskqueren').attr('href','{:U("Pay/personal_incharge")}');
		$('.index-maskqueren').html("余额不足，请充值"); 
	}else{
//		$('.msg').html('');
//		$('.msg').css('display','none');
		$('.index-maskqueren').attr('href','javascript:sub_form()');
		$('.index-maskqueren').html("立即支付"); 
	}
}
//涨跌点击
//lastprice买入价      balance当前余额     heyueid合约ID  heyuename合约名字  heyuezdp买涨买跌买平
//heyueshou手数值    heyuestart合约开始时间      heyueover合约结束时间  heyuemony一手所需金额    
//heyuexuanzhe当前选中的数量  youhui优惠券相关数组
var ssd=$('.diyu').length;
var balance,heyueid,heyuename,heyueshou,heyuestart,heyueover,heyuemony,heyuexuanzhe,youhui=new Array(ssd),heyuezdp;

//弹窗的现实和数据的获取
$('.data-heyue').each(function(){
	$(this).click(function(){
		balance     =$('#balance').val();
		heyueid 	=$(this).parent().parent().find('div').eq(0).attr('data-heyueid');
		heyuename	=$(this).parent().parent().find('div').eq(0).attr('data-heyuename');
		heyueshou	=$(this).parent().parent().find('div').eq(0).attr('data-heyueshou');
		heyuestart	=$(this).parent().parent().find('div').eq(0).attr('data-heyuestart');
		heyueover	=$(this).parent().parent().find('div').eq(0).attr('data-heyueover');
		lastprice	=$(this).parent().find('.threelileft').find('span').html();
		heyuemony	=$(this).attr('data-heyuemony');
		heyuezdp	=$(this).attr('data-downs');
		inits();
		$('.dailog_mask').show()
		$('.index-mask').show()
		
	})
})

//关闭弹窗
$('.dailog_mask').click(function(){
	$('.bottom-a').hide();
	$('.dailog_mask').toggle();
	$('.index-mask').each(function(){
		$('.msg').html('');
		$('.msg').css('display','none');
		$(this).hide();
	});
})
//初始化值
function inits(){
	$('#shuru').val(null);
	fsmongy();
	//设置所有优惠券面额的显示
	$('.index-maskjia').each(function(){
		$(this).parent().find('.data-miane').html($(this).attr('data-miane'));
	})
	//初始化默认选择的手数
	heyuexuanzhe=0;
	//默认不选中优惠券
	$('.index-clicks').each(function(){
		$(this).removeAttr('checked');
	})
	//设置显示的买涨买跌买平
	if(heyuezdp=='1'){
		$('.data-downs').find('span').html('买涨');
	}else if(heyuezdp=='2'){
		$('.data-downs').find('span').html('买平');
	}else if(heyuezdp=='0'){
		$('.data-downs').find('span').html('买跌');
	}
	//显示弹窗
	$('.dailog_mask').toggle();
	$('.index-mask').toggle();
	//显示合约名称
	$('.data-heyuename').html(heyuename);
	//循环手数
	for(var i=0;i<10;i++){
		$('.index-maskhand').find('span').eq(i).html(parseInt((heyueshou)*(i+1)));
	};
	$('.index-maskhand').find('span').each(function(){
		$(this).removeClass('act');
	});
	$('.index-maskhand').find('span').eq(0).addClass('act');
	if(heyueshou=='1'){
		//设置一手金额
		$('#index-djian').attr('data-mony',(parseInt(heyuemony)*parseInt(heyueshou)/10));
//		$('#index-djian').html((parseInt(heyuemony)*parseInt(heyueshou)/10)+'元');
		$('#index-djian').html(0+'元');
		heyuemony=heyuemony/10;
	}else if(heyueshou=='10'){
		//设置一手金额
		$('#index-djian').attr('data-mony',heyuemony);
		//显示一手金额
//		$('#index-djian').html(heyuemony+'元');
		$('#index-djian').html(0+'元');
		console.log('1')
	};
	//显示截止时间
	//$('.data-heyueshijian').find('span').html(heyuestart+'-'+heyueover);
	$('.data-heyueshijian').find('span').html(heyueover);
	//显示当前价格
	$('.data-lastprice').html(lastprice);
	//判断当前支付金额是否答应余额
	var money_total=$('.money_total').html();
	var money=$('#money').val();
	if(Number(money)<Number(money_total)){
		$('.index-maskqueren').attr('href','{:U("Pay/personal_incharge")}');
		$('.index-maskqueren').html("余额不足，请充值"); 
	}else{
		$('.index-maskqueren').attr('href','javascript:sub_form()');
		$('.index-maskqueren').html("立即支付"); 
	}
//	console.log(dataself+'/-',heyueid+'/id-',heyuename+'/name-',heyueshou+'/shou-',heyuestart+'/start-',heyueover+'/over-',heyuemony+'/合约金额');
};

//代金卷
var pso=new Array();
function youhuiquan(){
	pso = new Array();
	var num = 0;
	$('.diyu').each(function(){
		var xz=$(this).find('.index-clicks').attr('checked');
		if(xz=='checked'){
			var sid=$(this).find('.index-maskjia').attr('data-id');
			var snumber=$(this).find('.index-maskjia').find('.index-zhong').html();
			var sd=$(this).find('.index-maskjia').attr('data-array');
			pso[num]=new Array();
			pso[num][0]=sid;
			pso[num][1] = snumber;
			num++;
		}
	})
}

//提交
function sub_form(){
	
	$('.index-maskqueren').attr('href','javascript:void(0)');
	$('.index-maskqueren').css('background-color','#bab8b6');
	var id=heyueid;
	var money=heyuemony;
	//var number=$('.act').html();
	var number=heyuexuanzhe;
	if(number<=0){
		$('.msg').css('display','block');
		$('.msg').html('请输入购买的张数');
		$('.index-maskqueren').css('background-color','red');
		return;
	}
	var money_total=$('.money_total').html();
	var direction = heyuezdp;
	if(lastprice=='' || lastprice==0 || (typeof(lastprice) == "undefined")){
		return;
	}
	var url='{:U("Order/order_insert")}';
	youhuiquan();
	console.log(pso);
	if(!confirm("确认支付？")){
		return;
	}
	$.ajax({  
   		type:"post",  
    	dataType:"json",//如果返回数据是JSON格式，dataType请指定json  
       	url:url,  
       	data:{	"futures_id":id,
       			"unit_price":money,
       			"total_price":money_total,
       			"direction":direction,
       			"number":number,
       			"lastprice":lastprice,
       			"vouchers":pso}, 
       	//"futures_id="+id+"&unit_price="+money+"&total_price=" +money_total+"&direction="+direction+"&number="+number+"&lastprice="+lastprice+"&vouchers="+pso, 
       async:false, 
       success: function(data){    
  			if(data.status){
  				$('.msg').css('display','block');
  				//$('.index-maskqueren').css('background-color','red');
  				//$('.index-maskqueren').css('href','javascript:sub_form()');
				$('.msg').html(data.msg);
				setTimeout(link_url,2000);
			}else{
				$('.msg').css('display','block');
				$('.msg').html(data.msg);
				$('.index-maskqueren').css('background-color','red');
  				$('.index-maskqueren').css('href','javascript:sub_form()');
			}
		}  
  
	},JSON);  
};

function link_url(){
		var url_href="{:U('Index/index')}";
		window.location.href=url_href;	
			
};



setInterval(function(){
	var fid=$('.swiper-slide-active').find('.selidrtop1').attr('data-heyueid');
	var xindex=heyuezdp;
	var url = "{:U('Update/update_last_price')}";
	$.ajax({
		type:"post",
		url:url,
		data:{'fid':fid},
		async:true,
		success:function(data){
			$('.swiper-slide-active').find('.threeli').eq(0).find('.threelileft').find('span').html(data[1]);
			$('.swiper-slide-active').find('.threeli').eq(1).find('.threelileft').find('span').html(data[2]);
			$('.swiper-slide-active').find('.threeli').eq(2).find('.threelileft').find('span').html(data[0]);
			$('.data-lastprice').html(data[xindex]);
		}
	});
},2000)
//console.log(dataself+'/-',heyueid+'/id-',heyuename+'/name-',heyueshou+'/shou-',heyuestart+'/start-',heyueover+'/over-',heyuemony+'/合约金额');
  </script>
</block>
